﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>示例</title>
    <link href="../CSS/common.css" rel="stylesheet" type="text/css" />
    <link href="../CSS/popups.css" rel="stylesheet" type="text/css" />
    <link href="../CSS/treeview.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        input[type="button"]
        {
        	border:0;
        }
        .treeview li
        {
            background-image: url(../images/tree-gray-line.gif);
        }
        .treeview .hitarea, .treeview li.lastCollapsable, .treeview li.lastExpandable
        {
            background-image: url(../images/tree-gray.gif);
        }
        #ajaxStatus
        {
            z-index: 10010;
            position: absolute;
            width: 100px;
            height: 32px;
            display: none;
        }
        #ajaxStatus table
        {
            width: 100%;
            height: 32px;
        }
        #loadingText
        {
            padding-top: 8px;
            padding-bottom: 8px;
            padding-left: 0;
            padding-right: 0;
            width: 70px;
        }
    </style>

    <script src="../script/jquery.js" type="text/javascript"></script>
    <script src="../script/jquery.cookie.js" type="text/javascript"></script>
    <script src="../script/jquery.dimensions.min.js" type="text/javascript"></script>
    <script src="../script/jquery.contextmenu.r2.js" type="text/javascript"></script>
    <script src="../script/jquery.treeview.js" type="text/javascript"></script>
    <script src="../script/interface.fix.js" type="text/javascript"></script>
    <script src="../script/magic.js" type="text/javascript"></script>
    <script src="../script/region.js" type="text/javascript"></script>
    <script src="../script/org.js" type="text/javascript"></script>
    <script src="../script/selector.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function(){
            //=======================================================
            // 选择省份、城市、区域:
            // JS: region.js + (jquery.*.js; interface.fix.js; magic.js;)
            //=======================================================
            $("#selRegion").bind("click", function(){ 
                mm.query({  
                    id:"region", //只能是region
                    getter: new regionSelect(), title: "选择区域", 
                    mode:"s", //只能是s
                    values: [{ p:1 }, { p:9, c:81, d:401 }, {p:7, c:63 }], //当前被选择的，必须是一个数组，里面每一个对象代表一个选择项, 
                    callback: function(data, settings){
                        $("#txtRegionDesc").val(data.desc);
                        $("#txtProvinceID").val(data.p.id);
                        $("#txtProvinceDesc").val(data.p.desc);
                        $("#txtCityID").val(data.c.id);
                        $("#txtCityDesc").val(data.c.desc);
                        $("#txtDistrictID").val(data.d.id);
                        $("#txtDistrictDesc").val(data.d.desc);
                    }
                });
            }); //选择省份、城市、区域:
            
            //=======================================================
            // 选择组织
            // JS: org.js + (jquery.*.js; interface.fix.js; magic.js;)
            //=======================================================
            $("#selOrg").bind("click", function(){  
                mm.query( {
                    id:"org", //选组织传org，选合作企业传partner
                    getter: new orgSelect(), title: "选择组织", 
                    mode:"s", //s单选，m多选
                    values: $("#txtOrgID").val(), 
                    callback: function(data, settings){
                        $("#txtOrgID").val(data.id);
                        $("#txtOrgDesc").val(data.desc);
                    }
                });
            });//选择组织
            
            //=======================================================
            // 选择一级科室
            // JS: selector.js + (jquery.*.js; interface.fix.js;)，样式文件common.css, popups.css
            // 选择页面都参照topSection.ascx写
            //=======================================================
            $("#selTopSec").bind("click", function(){  
                var q = new query("TopSection"); //实现了一级科室选择页面的服务器端控件名字
                q.fnPopup({
                    top:50, left:50, width:400, height:250, //选择框的位置信息
                    mode: "m", //s单选，m多选
                    title: "选择一级科室",
                    data: {
                        selected: [ {code: "q1"}, {code: "eeee"} ], //当前选择的
                        name: "", //查询条件
                        code: "", //查询条件
                        pi: 1 //当前页数
                    },
                    on_select: function(r) { //点击确认按钮的回调函数，参数r为返回结果（数组）
                        var str="";
                        $(r).each(function(i, e){ //返回了一级科室的代码(code)和名称(name)
                            str = str + e.code + "&nbsp;&nbsp;&nbsp;" + e.name + "<br />" ;
                        });
                        $("#selTopSecResult").html(str);
                    }
                });
            });//选择一级科室
        });
    </script>

</head>
<body>
    <div id="selectRegion" style="margin-top:10px;">
        <input id="selRegion" type="button" value="选择省份、城市、区域" />
        &nbsp;&nbsp;<label>总的描述</label><input type="text" id="txtRegionDesc" value="上海" />
        &nbsp;&nbsp;<label>省份ID</label><input style="width:25px;" type="text" id="txtProvinceID" value="1" />
        &nbsp;&nbsp;<label>省份描述</label><input style="width:50px;" type="text" id="txtProvinceDesc" value="上海" />
        &nbsp;&nbsp;<label>城市ID</label><input style="width:25px;" type="text" id="txtCityID" />
        &nbsp;&nbsp;<label>城市描述</label><input style="width:50px;" type="text" id="txtCityDesc" />
        &nbsp;&nbsp;<label>区域ID</label><input style="width:25px;" type="text" id="txtDistrictID" />
        &nbsp;&nbsp;<label>区域描述</label><input style="width:50px;" type="text" id="txtDistrictDesc" />
    </div>
    <div id="selectOrg" style="margin-top:10px;">
        <input id="selOrg" type="button" value="选择组织" />
        &nbsp;&nbsp;<label>描述</label><input type="text" id="txtOrgDesc" style="width:250px;" />
        &nbsp;&nbsp;<label>ID</label><input style="width:25px;" type="text" id="txtOrgID" />
    </div>
    <div id="selectTopSection" style="margin-top:10px;">
        <input id="selTopSec" type="button" value="选择一级科室" style="float:left;" />
        <span style="float:left;">&nbsp;&nbsp;返回的结果&nbsp;&nbsp;</span>
        <div id="selTopSecResult" style="float:left; border:solid 1px #ccc;"></div>
    </div>
</body>
</html>
